<template>
  <div class="commission">
    <dt-search ref="search" :xl='6' :xlBtn='6'>
      <Button type="primary" v-if="unlocking('0210010101')"
        @click='onCreateRule'>新建佣金规则</Button>
    </dt-search>
    <dt-grid ref="table" :columns="columns" page :onFetch='onFetch' />

    <edit-modal ref='edit' @success='onSuccess'></edit-modal>
    <detail-modal ref='detail'></detail-modal>
  </div>
</template>

<script>
  import columnOpt from '../opt/column.js'
  import editModal from '../components/edit-modal.vue'
  import detailModal from '../components/detail-modal.vue'
  import ruleMgr from '@/biz/commission/rule.js'
  import searchOpt from '../opt/search.js'

  export default {
    components: {
      editModal,
      detailModal
    },
    data() {
      return {
        columns: []
      }
    },
    mounted() {
      this.columns = columnOpt.options(this)
      this.$refs.table.init(this)
      this.$refs.search.init(this.$refs.table, searchOpt.options(this), {
        commissionRuleType: 1,
        ruleStatus: '0',
      })
      this.$refs.table.fetch()
    },
    methods: {
      onCreateRule() {
        this.$refs.edit.create()
      },
      onDetail(item) {
        ruleMgr.detail(item.ruleId).then(res => {
          this.$refs.detail.show(res, 1)
        })
      },
      onRecall(item) {
        this.$Modal.confirm({
          title: '是否确认撤回已提交审核的佣金规则？',
          onOk: () => {
            ruleMgr.recall(item.ruleId).then(res => {
              this.$refs.table.fetch()
            })
          }
        })
      },
      onResend(item) {
        ruleMgr.detail(item.ruleId).then(res => {
          res.baseAgentCost = Number(res.baseAgentCost)
          res.depositPer = Number(res.depositPer)
          this.$refs.edit.edit(res)
        })
      },
      onCopy(item) {
        ruleMgr.detail(item.ruleId).then(res => {
          res.baseAgentCost = Number(res.baseAgentCost)
          res.depositPer = Number(res.depositPer)
          res.accessoryBOList = []
          res.remark = ''
          delete res.ruleId
          this.$refs.edit.copy(res)
        })
      },
      onDelete(item) {
        this.$Modal.confirm({
          title: '是否删除该佣金规则？',
          onOk: () => {
            ruleMgr.del(item.ruleId).then(res => {
              this.$refs.table.fetch()
            })
          }
        })
      },
      onSuccess() {
        this.$refs.table.fetch()
      },
      onFetch(data) {
        return ruleMgr.list(data)
      }
    }
  }
</script>

<style lang="scss" scoped>
  .commission {
    padding: 20px;
  }
</style>